<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" type="text/css" href="index.css" />
  <script src="jquery.js"></script>
  <script type="text/javascript" src="d3.v3.js"></script>
  <script src="recipe.js" type="text/javascript"></script>
</head>
<body>
  <div id="viz"></div>
  <script type="text/javascript" charset="utf-8">
      // basic init 
   var svg = d3.select("#viz")
    .append("svg")
    .attr("width", 1000)
    .attr("height"
		, 2500);

		var sampleSVG = svg.append("g");

    // here it starts
	var apple = new simple("Apple");
	apple.amount = "2";
	apple.picture = "apple.png";
	
	var knife = new multi("Knife");
	knife.picture = "knife.png";
	knife.Add(apple);
	
	var lemon = new simple("Lemon");
	lemon.picture = "lemon.png";
	lemon.amount = "3 cl juice";
	
	var sugar = new simple("Sugar").Picture("sugar.png").Amount("3 cups");

	var bowl = new multi("Bowl");
	bowl.picture = "bowl.png";
	bowl.Add(knife);
	bowl.Add(lemon);
	bowl.Add(new simple("Sugar").Picture("sugar.png").Amount("3 cups"));
	bowl.Add(new simple("Flour").Picture("flour.png").Amount("3 cups"));
	bowl.Add(new simple("Cinnam").Picture("cinnamon.png").Amount("1 TS"));

	master = new organizeMaster();
	
	master.Add(bowl).Add(new multi("9' Pie Pan").Picture("piepan.png").Add(new simple("Pastry").Picture("pastry.png")));
	master.Add(new multi("Knife").Picture("knife.png").Add(new simple("Pie").Picture("pastry.png")))
	master.Add(new simple("Oven").Picture("oven.png").Amount("425 °F"));
	master.Add(new timer(1));
	master.Add(new simple("Oven").Picture("oven.png").Amount("425 °F"));
	master.Add(new timer(45));
	
	master.Add(new multi("Small Bowl").Picture("bowl.png").
	  Add(new simple("Egg").Picture("egg.png").Amount("1 yolk")).
	  Add(new simple("Milk").Picture("milk.png").Amount("1 TS")),
	  1, 1);
	  
	master.Add(new simple("Brush").Picture("brush.png"), 1,2, 0, 3);  

	master.DrawAll();

	
  </script>

</body>
</html>